
*{
	margin: 0;
	padding: 0;
}

body, html{
	height: 100%;
	position: relative;
}


#wrapper{
	color: rgba(0,0,0, 0.7);
	min-height: 100%;
	background: #fcfcfc; /* Old browsers */
	background: -moz-linear-gradient(top, #fcfcfc 0%, #eaeaea 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#eaeaea)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #fcfcfc 0%,#eaeaea 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #fcfcfc 0%,#eaeaea 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #fcfcfc 0%,#eaeaea 100%); /* IE10+ */
	background: linear-gradient(to bottom, #fcfcfc 0%,#eaeaea 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#eaeaea',GradientType=0 ); /* IE6-9 */
	box-shadow: 0 4px 10px rgba(0,0,0,0.7);
	position: relative;
	z-index: 10;
	padding-bottom: 30px;
}

.clear{
	clear: both;
}

.left{
	float: left;
}

.right{
	float: right;
}

.infoBox {padding:10px; background-color: #FFF; width: 300px; font-size: 14px; border: 2px solid #3fa7d8; border-radius: 3px; margin-top: 10px }
.infoBox p { padding: 0 15px }
.infoBox:before { border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #3fa7d8; top: -10px; content: ""; height: 0; position: absolute; width: 0; left: 138px }


/******* TOP *******/

#top{

	height: 25%;
}

#logo{
	width: 40%;
	font-size: xx-large;
	float: left;
}

#menu{
	
	background-color: #0096d6;
    background-image: -webkit-linear-gradient(top, #0096d6, #008ac6);
    background-image: -moz-linear-gradient(top, #0096d6, #008ac6);
    background-image: linear-gradient(top, #0096d6, #008ac6);
	width: 20%;
	position:absolute;
	right:0;
	box-shadow: -1px 1px 4px rgba(0,0,0,0.2);
	border-radius: 0 0 0 3px;
	
	
}

#menu a{
	display: block;
	width: 90%;
	height: 100%;
	font-size: xx-large;
	padding-left: 20px;
	text-decoration: none;
	color: #FFF;
	-webkit-transition: all 0.5s;
}

#menu a:hover{
	
	color: rgba(0,0,0,0.4);
}



/************** CONTEUDO *********/

#content{
	min-height:70%;
	padding-top: 50px;
	
	
}

#infoEstado{
	margin-left: 70px;
	
}

#infoEstado h1{
	margin-right: 15px;
}


#graficos, #mapa{
	width: 90%;
	margin: 0 auto;
	
	
}

#mapa{
	background: rgba(255,255,255, 1);
	height: 500px;
	padding: 15px;
	box-shadow: 0 0 2px rgba(0,0,0, 0.1); 
}

#exibeMapaGeral{
	height: 100%;
	
}

#graficos table {
  margin: 10px auto;
  border-collapse:collapse;
  font-size:1.4em;
}
#graficos table td{
  padding:20px;
  text-align:left;
  
  border-bottom:1px dotted #ccc;
}

#graficos table:hover .alter{
	background: rgba(240,240,240,0.3);
}


.grafico{
	height: 400px;
	width: 48%;
	text-align: center;
	background: #FFF;
	margin-bottom: 70px; 
	box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
	
}

.formEstados{
	padding: 6px;
	margin-right: 15px;
}



div.grafico:hover h2{
	-webkit-animation: moveFromTop 0.4s ease;
	color: #008ac6;
}

@-webkit-keyframes moveFromTop { 
    from { -webkit-transform: translateY(-100%); opacity: 0}
    to { -webkit-transform: translateY(0%);}
}


/****** FOOTER *******/

footer{
	background-color: #31353a;
    background-image: -webkit-linear-gradient(top, #31353a, #2f3337);
    background-image: -moz-linear-gradient(top, #31353a, #2f3337);
    background-image: linear-gradient(top, #31353a, #2f3337);
	height: 180px;
	
}

#infEquipe{
	margin: 0 auto;
	width: 200px;
	padding-top: 10px;
	color: #FFF;
}

#infEquipe ul{
	list-style: none;
}

#infEquipe .equipe{
	display:block;
	padding:5px;
	background-color: #d75ba2;
    background-color: #e9ac40;
    background-image: -webkit-linear-gradient(top, #e9ac40, #d89f3b);
    background-image: -moz-linear-gradient(top, #e9ac40, #d89f3b);
    background-image: linear-gradient(top, #e9ac40, #d89f3b);
    text-transform: uppercase;
    text-shadow: 0 1px rgba(0,0,0,0.1);
    box-shadow: 0 0 10px rgba(0,0,0,1);
    margin-bottom: 10px;
    
}




